<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>视频发布管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/static/resouces/layuiadmin/layui/css/layui.css" media="all">
    <style type="text/css">
        .layui-card-header{
            margin-top: 15px;
        }
    </style>
</head>
<body>
<form class="layui-form" action="">
    <div class="layui-form-item" style="margin-top: 15px;margin-left: 15px">
        <div class="layui-inline">
            <select name="status" lay-verify="">
                <option value="-1">全部</option>
                <option value="0">未通过</option>
                <option value="1">通过</option>
            </select>
        </div>
        <div class="layui-inline">
            <button class="layui-btn layuiadmin-btn-comm" data-type="reload" lay-submit lay-filter="LAY-app-contcomm-search">
                <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
            </button>
        </div>
    </div>
</form>

<table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>

<script type="text/html" id="switchTpl">
    <input type="checkbox" name="status" value="{{d.id}}" lay-skin="switch" width="100px" lay-text=" 通过|未通过" lay-filter="statusDemo" {{ d.status == 1 ? 'checked' : '' }}>
</script>

<script type="text/html" id="currentTableBar">
    <a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete"><i class="layui-icon layui-icon-delete"></i>删除</a>
</script>
</body>
<script src="/static/resouces/layuiadmin/layui/layui.js" charset="utf-8"></script>
<script th:inline="none">
    var global_table;

    layui.use(['form', 'table'], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table;

        var tableIns = table.render({
            elem: '#currentTableId',
            url: '/video',
            defaultToolbar: [],
            cols: [[
                {type: 'numbers', fixed: 'left'},
                {field: 'id', title: 'ID', width:100, sort: true},
                {field: 'name', title: '视频名称', width:100},
                {field: 'url', title: '视频地址', minWidth:400},
                {field: 'uid', title: '用户ID', width:100, sort: true},
                {field: 'createTime', title: '创建时间', minWidth:100, sort: true},
                {field: 'updateTime', title: '更新时间', minWidth:100, sort: true},
                {field: 'status', title: '审批状态', width:150, templet: '#switchTpl', unresize: true},
                {field: 'type', title: '视频类型', Width:100, sort: true},
                {title: '操作', width: 100, templet: '#currentTableBar', fixed: "right", align: "center"}
            ]]
        });

        //监听审查操作
        form.on('switch(statusDemo)', function(obj){
            var videoId = this.value;
            var status = obj.elem.checked?1:0;
            //console.log(videoId,status);
            //更新数据库
            $.ajax({
                url: "/video",
                type: "PUT",
                dataType: "json",
                data: {
                    id: videoId,
                    status: status
                },
                success: function (res) {
                    console.log(res);
                },
                error: function (res) {
                    console.error(res);
                }
            });
        });

        global_table = table; // 复制全局变量

        // 监听搜索操作
        form.on('submit(LAY-app-contcomm-search)', function (data) {
            //var result = JSON.stringify(data.field);
            var status = parseInt(data.field.status);

            //执行搜索重载
            global_table.reload('currentTableId', {
                method: 'GET',
                url: '/video',
                where: {
                    status: status
                }
            });

            return false;
        });

        table.on('tool(currentTableFilter)', function (obj) {
            var data = obj.data;
            if (obj.event === 'delete') {
                layer.confirm('真的删除行么', function (index) {
                    //请求数据
                    $.ajax({
                        url: "/video/" + obj.data.id,
                        type: "DELETE",
                        success: function (res) {
                            console.log(res);
                        },
                        error: function (res) {
                            console.error(res);
                        }
                    });

                    //删除表项
                    obj.del();
                    layer.close(index);
                });
            }
        });

    });
</script>
</html>
